<template>
    <div>
        <div class="stateBox">
            <el-steps :active="currentState" align-center>
                <el-step title="等待发货" ></el-step>
                <el-step title="运送中"></el-step>
                <el-step title="配送中"></el-step>
                <el-step title="已签收"></el-step>
            </el-steps>
        </div>
        <div class="orderlist">
            <div v-for="item in order.book" class="bookItem" >
                <div class="img" @click="goodetail(item.b_id)">
                    <img :src="require('../assets/' + item.img)">
                </div>
                <div class="title" @click="godetail(item)">{{item.name}}</div>
                <div class="author">{{item.author}}</div>
                <div class="amount">{{item.amount}}</div>
                <div class="price">￥{{Price(item.total,item.amount)}}</div>
                <div class="totle">￥{{item.total}}</div>
            </div>
        </div>
    </div>
</template>
<script>
import axios from "axios"
export default {
    data(){
        return{
            order:[],
            currentState:0
        }
    },
    props:['orderId'],
    mounted(){
        // axios.get('api/user/getOrder',{
        //     params:{
        //       id:this.$route.params.orderId,
        //   }
        // }).then(Response=>{
        //         console.log(Response);
        //         if(Response.code===2){
        //             console.log(Response.msg);
        //             this.order=[...Response.data]
        //             this.currentState=this.order.state
        //             console.log(this.order)
        //         }else{
        //             alert(Response.msg);
        //         }
        //     })
    },
    methods:{
        goodetail(id){
            this.$router.push('/detail/'+ id)
        },
        Price(total,amount){
          return total/amount
      },
    }
}
</script>
